import React, { useState } from 'react'
import "./index.less"
import { connect } from "react-redux"
import action from '../../store/action/shopCar'
import { withRouter } from 'react-router-dom'
function Index(props) {
    let { data, addCarData } = props
    console.log(data);
    // 跳转到详情页
    function toShopDetail(res) {
        let obj = {
            Js: data.Js,
            Pj: JSON.parse(data.Pj),
            Xq: JSON.parse(data.Xq),
            id: data.id,
            img: data.img,
            name: data.name,
            page: JSON.parse(data.page),
            price: data.price,
            Xqjs: data.Xqjs,
        }
        props.history.push({
            pathname: '/Xq',
            state: obj
        })
        console.log(obj);
    }

    // 加入购物车
    function addCar(res) {
        let obj = {
            Js: res.Js,
            Pj: JSON.parse(res.Pj),
            Xq: JSON.parse(res.Xq),
            id: res.id,
            img: res.img,
            name: res.name,
            page: JSON.parse(res.page),
            price: res.price,
            isCheck: "false",
            num: 1,
        }
        addCarData(obj)
    }
    return (
        <div className="shopCom" onClick={() => { toShopDetail(data) }}>
            <img className="shop_img" src={data.img} alt="" />
            <p className="shop_name">{data.name}</p>
            <p className="shop_label">
                {
                    JSON.parse(data.page).map((item, index) => {
                        return <span key={index}>{item}</span>
                    })
                }
            </p>
            <div>
                <p className="shop_price">
                    <span>￥{data.price}</span>/盒
                </p>
                <p className="shop_addCar" onClick={(e) => {
                    e.stopPropagation()
                    addCar(data)
                }}>
                    <span className="iconfont icon-gouwuche"></span>
                </p>
            </div>
        </div>
    )
}
export default connect(state => state, action)(withRouter(Index))